<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <title>找回密码</title>
    <link href="../../css/mui.min.css" rel="stylesheet"/>
    <link href="../../css/common.css" rel="stylesheet"/>
    <style type="text/css">
    	body{
    		background-color: #F9F9F9;
    	}
    	.mui-title{
            color: #8cb33e;
        }
        header .mui-icon{
        	color: #8cb33e;
        }

        a:active {color:#8cb33e;}

        .send-code .mui-icon-clear {
            right: 80px!important;
        }
        .mui-content{
        	background-color: #F9F9F9;
        	margin-top: 12px;
        }
        .mui-btn{
            margin-top: 20px;
            width: 90%;
            padding: 10px 12px;
            border-radius: 10px;
            border: 1px solid #8cb33e;
            color: #8cb33e;
            background-color: #FFF;
        }

        .mui-btn-blue:active {
			color: #fff;
			border: 1px solid #8cb33e!important;
			background-color: #8cb33e!important;
		}

        .mui-input-row label{
            font-size: 14px;
            width: 20%;
            font-family: "微软雅黑","黑体","宋体",sans-serif !important;
        }

        .mui-input-row label~input{
            width: 80%;
            color: #aab2bd;
            font-size: 14px;
            text-align: left;
        }

        .mui-input-group:before {
        	background-color: #ffffff;
        	height: 0;
        }
        .mui-input-group:after{
        	background-color: #ffffff;
        	height: 0;
        }
        .mui-input-group .mui-input-row:after{
        	background-color: #CCC;
        	left: 0
        }
        .mui-input-group .mui-input-row:last-child:after{
        	height: 0;
        }
        .mui-checkbox input[type=checkbox]:checked:before {
		    color: #8cb33e;
		}
        #clickSend {
            width: 20%;
            float: right;
            line-height: 1.3;
            padding: 11px 0;
            text-align: center;
            color: #FFF;
        }
        #clickSend.sending {
            background: #ccc;
        }
    </style>
</head>
<body>
    <header class="mui-bar mui-bar-nav">
        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
        <h1 class="mui-title">找回密码</h1>
    </header>
    <div class="mui-content">
        <div class="mui-input-group">
            <div class="mui-input-row">
                <label>手机号</label>
                <input type="text" class="mui-input-clear" placeholder="11位手机号码" id="phone">
            </div>
            <div class="mui-input-row send-code">
                <label>验证码</label>
                <input id="code" type="text" style="width: 60%;float: left;" class="mui-input-clear" placeholder="验证码">
                <button id="clickSend" class="app-back-color">发送</button>
            </div>
            <div class="mui-input-row">
                <label>新密码</label>
                <input type="password" class="mui-input-clear" placeholder="字母数字，不少于6位" id="password">
            </div>
        </div>
        <div class="mui-content-padded" align="center">
            <button type="button" class="mui-btn mui-btn-blue app-back-color" id="reg">修改密码</button>
        </div>
    </div>
    <script src="../../js/mui.min.js"></script>
	<script src="../../js/http.js"></script>
    <script type="text/javascript" charset="utf-8">
		// 页面全局变量
		var $ = mui, doc = document;
        var phone = doc.getElementById("phone");
        var sendBtn = doc.getElementById("clickSend");
        sendBtn.addEventListener('tap', function () {
            if (!phone.value.trim()) {
                $.toast('请输入手机号');
                return
            }
            var count = 60;
            sendBtn.setAttribute("disabled", true);
        	sendBtn.innerHTML = count + '秒';
        	var timer = setInterval(function () {
        		count--;
        		if (count === 0) {
                    sendBtn.removeAttribute("disabled");
                    sendBtn.innerHTML = '发送';
                    clearInterval(timer);
        		} else {
        			sendBtn.innerHTML = count + '秒';
        		}
        	}, 1000);
        	// 发送请求
        	$.ajax(http + '/user/sendMessage',{
                data:{
                    phone: phone.value.trim(),
                    send: false
                },
                dataType:'json',
                type:'GET',
                timeout:10000,
                success:function(data){
                    if(data.code === 0){
                        $.toast(data.msg);
                    }else{
                        //登录失败
                        $.toast(data.msg);
                    }
                },
                error:function(){
                }
            });
        });

        $.plusReady(function() {
            var password = doc.getElementById("password");
            var code = doc.getElementById("code");
            var passwordConfirm = doc.getElementById("passwordConfirm");
            var reg = doc.getElementById("reg");
            // 登录
            reg.addEventListener('tap',function() {
                if(phone.value.length==0){
                    plus.ui.toast("手机号不能为空");
                    return;
                }
                if(code.value.length==0){
                    plus.ui.toast("验收码不能为空");
                    return;
                }
                if(password.value.length==0){
                    plus.ui.toast("新密码不能为空");
                    return;
                }
                var opt = {
                	phone: phone.value.trim(),
                    password: password.value.trim(),
                    randID: code.value.trim(),
                    imei: plus.device.imei,
                    isDoctor: true
                }
                // 请求 地址 参数 类型
            	myHttp('/user/forgetPassword', opt, 'GET', function (result) {
            		if(result.code === 0){
                        //登录成功
                        plus.ui.toast("修改成功");
		                $.back();
                    }else{
                        //登录失败
                        plus.ui.toast(result.msg);
                    }
            	});
            })
        })
    </script>
</body>
</html>